﻿/*Information about the author
@author: Nhựt Đào
@Job: Design & develop html
@Website: n/a
@Persionalmail: daoxuannhut@gmail.com or daoxuannhut@outlook.com
@yh: daoxuan_nhut
@sky: mr.asut27
================================================*/
/*===================(*_*) Customer Stylesheet (*_*)===================*/
/*=================Create css for common in project=================*/
::selection { background: #57AF2B; color: #fff; opacity: 1; }
::-moz-selection { background: #57AF2B; color: #fff; opacity: 1; }
html, body { font-family: 'Roboto Condensed', sans-serif; font-size: 14px; color: #000; }
.page { }
.icon { background-image: url(images/icon.png); background-repeat: no-repeat; }
/*sidebar all page*/
#sidebar { background: #86e2d5; padding: 4px 0; }
    #sidebar .branddesign { }
        #sidebar .branddesign a { text-decoration: none; color: #049372; }
    #sidebar .fllowus { display: block; text-align: center; }
        #sidebar .fllowus ul { display: table; list-style: none; margin: 0 auto; padding: 0; }
            #sidebar .fllowus ul:before,
            #sidebar .fllowus ul:after { display: table; content: ''; clear: both; }
            #sidebar .fllowus ul li { display: inline-block; float: left; margin-left: 10px; }
                #sidebar .fllowus ul li:first-child { margin-left: 0; }
                #sidebar .fllowus ul li a { text-decoration: none; }
                    #sidebar .fllowus ul li a .icon { }
    #sidebar .language { }
        #sidebar .language .dropdown { }
            #sidebar .language .dropdown .btn { }
            #sidebar .language .dropdown .btn-default { border: none; background: none; color: #049372; text-shadow: none; }
/*header all page*/
#header { }
/*bannner all page*/
.banner { }
.wrapper { }
    .wrapper .breadcrumb { border-radius: 0; padding: 0; background: none; border: none; }
#footer { border-bottom: 1px solid #57AF2B; }
    #footer .coppyright { text-align: center; }
.title { background: none; padding: 5px 0; }
    .title h1, .title h2, .title h3, .title h4, .title h5, .title h6 { font-weight: 700; margin: 0; }
    .title h1 { font-size: 32px; }
    .title h2 { font-size: 28px; }
    .title h3 { font-size: 24px; }
    .title h4 { font-size: 18px; }
    .title h5 { font-size: 14px; }
    .title h6 { font-size: 12px; }
a { -moz-transition: color 300ms; -o-transition: color 300ms; -webkit-transition: color 300ms; transition: color 300ms; text-decoration: none; }
.thumb-pad { position: relative; }
    .thumb-pad .thumbnail { }
        .thumb-pad .thumbnail a { }
        .thumb-pad .thumbnail img { }

        .thumb-pad .thumb-caption { }
/*=================Create css for customer management module=================*/

/*.coming-soon stands for page cooming soon*/
.coming-soon { margin: 110px auto 140px auto; display: table; }
    .coming-soon #clock { display: block; }
        .coming-soon #clock:before,
        .coming-soon #clock:after { display: table; content: ''; clear: both; }
        .coming-soon #clock .clockall { text-align: center; float: left; padding: 10px 5px; margin: 0 15px; display: table; font-size: 32px; border: 1px solid #ededed; box-shadow: 1px 1px 5px rgba(0,0,0,0.75); width: 100px; border-radius: 8px; text-transform: uppercase; margin-bottom: 10px; }
            .coming-soon #clock .clockall:first-child { margin-left: 15px; }
            .coming-soon #clock .clockall span { display: block; width: 100%; text-transform: none; }
        .coming-soon #clock .clockw { }
        .coming-soon #clock .clockd { }
        .coming-soon #clock .clockh { }
        .coming-soon #clock .clockm { }
        .coming-soon #clock .clocks { }
/*.ctm = stands for customer all page*/
.ctm { }
    .ctm .ctm-profile { }
        .ctm .ctm-profile .title { border-bottom: 5px solid #57AF2B; }
        .ctm .ctm-profile .jumbotron { padding: 10px; border-radius: 0; background: none; margin: 0; }
            .ctm .ctm-profile .jumbotron h4 { }
            .ctm .ctm-profile .jumbotron p { font-size: 14px; color: #808080; font-weight: normal; }
        .ctm .ctm-profile section.psn { padding: 15px 0; }
            .ctm .ctm-profile section.psn:before,
            .ctm .ctm-profile section.psn:after { display: table; clear: both; content: ''; }
            .ctm .ctm-profile section.psn .psn-title { display: block; padding: 0; border-bottom: 1px solid #E0E0E0; margin-bottom: 15px; }
                .ctm .ctm-profile section.psn .psn-title:before,
                .ctm .ctm-profile section.psn .psn-title:after { display: table; clear: both; content: ''; }
                .ctm .ctm-profile section.psn .psn-title h5 { font-weight: 700; float: left; margin: 0; }
                .ctm .ctm-profile section.psn .psn-title a { float: right; font-size: 13px; }
        .ctm .ctm-profile .blog { border: 1px solid #E0E0E0; margin: 0; padding: 0 8px; }
            .ctm .ctm-profile .blog .header { margin: 15px 0 0; }
                .ctm .ctm-profile .blog .header h5 { margin: 0; border-bottom: 1px solid #E0E0E0; padding-bottom: 4px; }
                    .ctm .ctm-profile .blog .header h5 .glyphicon { color: #57AF2B; }
            .ctm .ctm-profile .blog .body { margin: 15px 0 0; min-height: 40px; }
                .ctm .ctm-profile .blog .body a { color: #57AF2B; text-decoration: none; }
                    .ctm .ctm-profile .blog .body a:hover { color: #ff6a00; }
            .ctm .ctm-profile .blog .bottom { margin: 15px 0 0; border-top: 1px solid #E0E0E0; text-align: right; padding: 4px 0; }
                .ctm .ctm-profile .blog .bottom .btn { padding: 0; text-decoration: none; color: #3E771F; -moz-transition: color 250ms; -o-transition: color 250ms; -webkit-transition: color 250ms; transition: color 250ms; }
                    .ctm .ctm-profile .blog .bottom .btn:hover { color: #ff6a00; }
    .ctm .ctm-ctl { display: block; }
        .ctm .ctm-ctl .ctm-avt { display: block; padding: 5px; border: 1px solid #E0E0E0; position: relative; }
            .ctm .ctm-ctl .ctm-avt .ctm-avt-edit { width: 24px; height: 24px; font-size: 18px; position: absolute; display: none; overflow: hidden; bottom: 15px; right: 15px; }
                .ctm .ctm-ctl .ctm-avt .ctm-avt-edit .glyphicon { cursor: pointer; }
            .ctm .ctm-ctl .ctm-avt .ctm-avt-img { overflow: hidden; display: block; width: 100%; }
                .ctm .ctm-ctl .ctm-avt .ctm-avt-img img { max-width: 100%; }
        .ctm .ctm-ctl .ctm-list { }
            .ctm .ctm-ctl .ctm-list .list-group { }
                .ctm .ctm-ctl .ctm-list .list-group .list-group-item { position: relative; padding: 6px 10px 3px; }
                    .ctm .ctm-ctl .ctm-list .list-group .list-group-item.active { background: none; /*border: none;*/ border-radius: 0; border-color: #ddd; }
                    .ctm .ctm-ctl .ctm-list .list-group .list-group-item a { color: #3E771F; -moz-transition: color 250ms; -o-transition: color 250ms; -webkit-transition: color 250ms; transition: color 250ms; font-size: 13px; text-decoration: none; text-shadow: none; display: block; }
                        .ctm .ctm-ctl .ctm-list .list-group .list-group-item a:hover,
                        .ctm .ctm-ctl .ctm-list .list-group .list-group-item.active a { color: #ff6a00; }
                    .ctm .ctm-ctl .ctm-list .list-group .list-group-item .glyphicon { position: absolute; right: 3px; top: 12px; color: #ff6a00; width: 14px; height: 14px; display: none; }
    .ctm .ctm-profile section.psn.psn-repass { }
        .ctm .ctm-profile section.psn.psn-repass .blog { width: 80%; margin: 0 auto; }
/*.ifr-edit-avt = iframe edit avatar popup*/
.ifr-edit-avt { }
    .ifr-edit-avt .tab-content { padding: 10px; border: 1px solid #ddd; border-top: none; }
#choosephoto { }
    #choosephoto .thumb-pad .thumbnail { -moz-transition: border-color 250ms; -o-transition: border-color 250ms; -webkit-transition: border-color 250ms; transition: border-color 250ms; }
    #choosephoto .thumb-pad .thumbnail img{ opacity: 0.75; -moz-transition: opacity 250ms; -o-transition: opacity 250ms; -webkit-transition: opacity 250ms; transition: opacity 250ms; }
#choosephoto .thumb-pad .thumbchecked{ width: 16px; height:16px; display: block; overflow: hidden; text-align: center; vertical-align: middle; right: 3px; top: 3px; position: absolute; }
    #choosephoto .thumb-pad .thumbchecked input[type=radio] { margin: 0; }
    #choosephoto .thumb-pad:hover .thumbnail{ border-color: #ff6a00; }
        #choosephoto .thumb-pad:hover .thumbnail img { opacity: 1;}
#accinfo { }
    #accinfo .form-group { }
#accinfo .form-group label.label{ display: block; text-align: right; line-height: 32px; font-size: 16px; color: #808080; }
